<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <%--    <link rel="shortcut icon" href="${pageContext.request.contextPath}/images/logo.ico" type="image/x-icon">
        <title>用户数据</title>--%>
    <!-- 1. 导入CSS的全局样式 -->
    <link href="${pageContext.request.contextPath}/css/bootstrap.css" rel="stylesheet">
    <!-- 2. jQuery导入，建议使用1.9以上的版本 -->
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="${pageContext.request.contextPath}/js/bootstrap.js"></script>

    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js" charset="utf-8"></script>
    <style>

        .head_flex img {
            margin: 10px;
            height: 28px;
            width: 80px;
        }
        .mytable {
            display: flex;
            justify-content: center;
        }
        table {
            border-collapse: collapse;
            width: 100%;
        }
        caption {
            font-size: 25px;
            font-weight: 800;
        }
        table, th, td {
            border: 1px solid black;
        }
        th {
            height: 50px;
            text-align: center;
        }
        .success th {
            background-color: #dff0d8;
        }
        td {
            height: 50px;
            text-align: center;
        }
        tr:nth-child(even) {
            background-color: #f2f2f2;
        }
        th {
            background-color: white;
        }
        .footer {
            display: flex;

            justify-content: center;
        }
        .footer2 {
            display: flex;
            width: 100%;
            justify-content: space-between;
        }
        .footer2 p {
            margin: 10px;
        }
        .edit_content {
            display: flex;
            justify-content: center;
        }
        .edit_content button{
            width: 30%;
            height: 30px;
            border: 2px solid #909399;
            border-radius: 5px;
            background-color: #909399;
        }
        .edit_content button a {
            color: white;
            text-decoration:none;
        }
        .edit_content button:hover {
            opacity: 0.5;
        }
        caption {
            font-size: 25px;
            font-weight: 800;
        }
        .form-inline {
            /*            background-color: #a6e1ec;*/
            margin: 0 auto;
            margin-top: 10px;
            font-size: 16px;
            width: 99%;
            display: flex;
            justify-content: space-between;
            color: #787878;
        }


    </style>
</head>
<body>

<div class="mytable">

    <table border="1" >
        <caption style="text-align: center; color: #0f0f0f" >项目信息管理</caption>
        <tr class="success">
            <th>项目ID</th>
            <th >项目名</th>
            <th>项目地址</th>
            <th>操作</th>
        </tr>
        <c:forEach items="${project}" var="project" varStatus="s" >
            <tr>
                <td>${s.count}</td>
                <td>${project.project_name}</td>
                <td>${project.project_location}</td>
                <td>
                    <a class="btn btn-default btn-sm" href="receiveProDataServlet?project_id=${project.project_id}">修改</a>&nbsp;
                    <a class="btn btn-default btn-sm" href="deleteProjectServlet?project_id=${project.project_id}">删除</a>
                </td>
            </tr>
        </c:forEach>
    </table>
</div>

<script type="text/javascript">
    layui.use(['layer'], function() {
        var layer = layui.layer; //弹层

        <c:if test="${delError != null}">
        layer.msg('${delError}');
        </c:if>

        <c:if test="${succes != null}">
        layer.msg('${succes}');
        </c:if>

    });



</script>
</body>
</html>
